@import "~pc/styles/lib_mixins.less";

.ant-checkbox-indeterminate .ant-checkbox-inner,
.ant-checkbox-inner {
  width: 16px;
  height: 16px;
  border: none;
  background: var(--fc3);
  position: relative;
  &::after {
    width: 14px;
    height: 14px;
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: rotate(0) translate(-50%, -50%);
    content: " ";
    background: var(--defaultBg);
    border: none;
    opacity: 1;
    border-radius: 3px;
    transition: none;
  }
}
.ant-checkbox-wrapper:hover :not(.ant-checkbox-disabled) .ant-checkbox-inner {
  background: var(--primaryColor);
}
.ant-checkbox-checked .ant-checkbox-inner {
  background: var(--primaryColor);
  &::before {
    z-index: 1;
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    content: " ";
    width: 12px;
    height: 12px;
    background: #7B67EE;
    // Use static/icon/element/element_icon_checkbox.svg to convert to base64
    mask: url("");
    -webkit-mask: url("");
  }
  &::after {
    transform: rotate(0) translate(-50%, -50%);
    border: none;
  }
}
.ant-checkbox-checked:not(.ant-checkbox-disabled) .ant-checkbox-inner {
  &::after {
    background: var(--primaryColor);
  }
  &::before {
    background: var(--staticWhite0);
  }
}
.ant-checkbox-input:focus + .ant-checkbox-inner {
  border-color: var(--primaryColor);
}
.ant-checkbox-checked.ant-checkbox-disabled .ant-checkbox-inner,
.ant-checkbox-disabled .ant-checkbox-inner {
  background-color: var(--shadowColor);
  &::before {
    background: var(--shadowColor);
  }
  &::after {
    background: var(--lowestBg);
  }
}
